import 'ol/ol.css';
import { Map, View } from 'ol';
import TileLayer from 'ol/layer/Tile';
import OSM from 'ol/source/OSM';
import ContextMenu from 'ol-contextmenu'
import 'ol-contextmenu/dist/ol-contextmenu.min.css'

const map = new Map({
    target: 'map',
    layers: [
        new TileLayer({
            source: new OSM()
        })
    ],
    view: new View({
        center: [0, 0],
        zoom: 0
    })
});
var contextmenu = new ContextMenu({
    with: 170,
    defaultItems: true,
    items: [{
            text: 'center map here',
            classname: 'style1',
            callback: () => {
                console.log('center')
            }
        },
        {
            text: 'add a marker',
            classname: '',
            icon: 'img/marker.png',
            callback: () => {
                console.log('marker')
            }
        }

    ]
});
map.addControl(contextmenu);